<!DOCTYPE html>
<html>

<head >
    <meta charset="UTF-8">
    <title>课工场论坛列表</title>
   
    <link href="css/bbs.css" rel="stylesheet">
</head>

<body>
    <div class="bbs">
        <header><span id="showForm">我要发帖</span></header>
        <section>
            <ul class="articles">
                
            </ul>
        </section>
        <div class="post">
            <input name="title" class="title" placeholder="请输入标题（1-50个字符）">
            所属版块：
            <select class="block">
                <option>请选择版块</option>
                <option value="电子书籍">电子书籍</option>
                <option value="新课来了">新课来了</option>
                <option value="新手报到">新手报到</option>
                <option value="职业规划">职业规划</option>
            </select>
            <textarea class="content"></textarea>
            <input class="btn" value="发布">
        </div>
    </div>

</body>
<script src="../../lib/font/jquery.min.js"></script>
<script src="../../lib/font/date.js"></script>
<script>
    let n =1;
    $(function(){
        $("#showForm").click(function(){
            $('.post').show();
        });
      
        $(".post .btn").click(function(){
            $('.post').hide();


            let title = $('input[name="title"]').val();
            let block = $('.block').val();
             

            $('.title').val();
            $('.block').val();

            let html = `
            <li>
                    <img src="./images/tou0${n%4 +1}.jpg" alt="">
                    <p class="title">${title}</p><br>
                    <div class="info">
                        <div class="item">
                            <label >板块：</label>
                            <span>${block}</span>
                        </div>
                        <div class="item">
                            <label >发表时间：</label>
                            <span>${getNow()}</span>
                        </div>
                    </div>
                </li>
            `;
            n++;
            $(html).prependTo($('.articles'));


            $('input[name="title"]').val('');
            $('.block').val('');
             
            $('.content').val('');

           

        });

    })



</script>

</html>